<template>
  <SearchTablePage :search-config="baseTableSearchModel" :table-config="baseTableModel" />
</template>

<script lang="ts" setup>
defineOptions({
  name: "DrillInfoMaterialRecordPageData", //全局别名
  title: "表格页", //标题
});
// 接口
import DrillInfoMaterialRecordApi from "/@/api/DrillInfoMaterialRecordApi.ts";

import FORM_FIELD_TYPE from "/@/constants/FormFieldType";
import VDialog from "/@/utils/dialogUtil.ts";

const router = useRouter();
const baseTable = ref(null as any);
const baseTableSearch = ref(null as any);
const editRef = ref<any>(null);

// 表格搜索初始化searchModel
const baseTableSearchModel = ref({
  columnCount: 4,
  expandLimit: 6,
  autoFit: true,
  columnWidth: "300px",
  labelPosition: "right",
  labelWidth: "100px",
  items: [
    //搜索项初始化

    // {
    //   label: "id",
    //   field: "id",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.INPUT,

    //   placeholder: "请输入",
    // },

    // {
    //   label: "资料id",
    //   field: "materialId",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.INPUT,

    //   placeholder: "请输入",
    // },

    // {
    //   label: "报名记录",
    //   field: "entryId",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.INPUT,

    //   placeholder: "请输入",
    // },

    // {
    //   label: "活动id",
    //   field: "drillId",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.INPUT,

    //   placeholder: "请输入",
    // },

    // {
    //   label: "用户id",
    //   field: "userKey",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.INPUT,

    //   placeholder: "请输入",
    // },
    {
      label: "姓名",
      field: "staffName",
      clearable: true,
      type: FORM_FIELD_TYPE.INPUT,

      placeholder: "请输入",
    },
    {
      label: "手机号",
      field: "phone",
      clearable: true,
      type: FORM_FIELD_TYPE.INPUT,

      placeholder: "请输入",
    },

    // {
    //   label: "公司ID",
    //   field: "companyId",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.INPUT,

    //   placeholder: "请输入",
    // },

    // {
    //   label: "员工id",
    //   field: "staffId",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.INPUT,

    //   placeholder: "请输入",
    // },



    // {
    //   label: "身份证",
    //   field: "staffIdentity",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.INPUT,

    //   placeholder: "请输入",
    // },

    {
      label: "开始时间",
      field: "startTime",
      startDateField: "startStartTime",
      endDateField: "endStartTime",
      clearable: true,
      type: FORM_FIELD_TYPE.DATE_RANGE,
      placeholder: "请输入",

      config: {
        props: {
          //日期精度配置
          type: "daterange",
          startPlaceholder: "开始日期",
          endPlaceholder: "结束日期",
          format: "YYYY-MM-DD",
        },
      },
    },

    // {
    //   label: "结束时间",
    //   field: "endTime",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.DATE,
    //   placeholder: "请输入",

    //   config: {
    //     props: {
    //       //日期精度配置
    //       type: "daterange",
    //       startPlaceholder: "开始日期",
    //       endPlaceholder: "结束日期",
    //       format: "YYYY-MM-DD",
    //     },
    //   },
    // },

    // {
    //   label: "上次学习时间",
    //   field: "latestLearningTime",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.DATE,
    //   placeholder: "请输入",

    //   config: {
    //     props: {
    //       //日期精度配置
    //       type: "daterange",
    //       startPlaceholder: "开始日期",
    //       endPlaceholder: "结束日期",
    //       format: "YYYY-MM-DD",
    //     },
    //   },
    // },

    // // {
    // //   label: "上次学习detail_id",
    // //   field: "latestDetailId",
    // //   clearable: true,
    // //   type: FORM_FIELD_TYPE.INPUT,

    // //   placeholder: "请输入",
    // // },

    // {
    //   label: "持续时间s",
    //   field: "duration",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.INPUT,

    //   placeholder: "请输入",
    // },

    // // {
    // //   label: "资料url",
    // //   field: "materialUrl",
    // //   clearable: true,
    // //   type: FORM_FIELD_TYPE.INPUT,

    // //   placeholder: "请输入",
    // // },

    // // {
    // //   label: "创建人",
    // //   field: "creator",
    // //   clearable: true,
    // //   type: FORM_FIELD_TYPE.INPUT,

    // //   placeholder: "请输入",
    // // },

    // // {
    // //   label: "修改人",
    // //   field: "reviser",
    // //   clearable: true,
    // //   type: FORM_FIELD_TYPE.INPUT,

    // //   placeholder: "请输入",
    // // },

    // // {
    // //   label: "排序",
    // //   field: "sort",
    // //   clearable: true,
    // //   type: FORM_FIELD_TYPE.INPUT,

    // //   placeholder: "请输入",
    // // },

    // {
    //   label: "创建时间",
    //   field: "create_time",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.DATE_RANGE,
    //   placeholder: "请输入",

    //   config: {
    //     props: {
    //       //日期精度配置
    //       type: "daterange",
    //       startPlaceholder: "开始日期",
    //       endPlaceholder: "结束日期",
    //       format: "YYYY-MM-DD",
    //     },
    //   },
    // },
  ],

  buttons: [
    //功能区域
    {
      name: "导出",
      buttonClass: "primary",
      width: 100,
      click: ({ row, handlers }) => {
        //暴露的方法钩子
        DrillInfoMaterialRecordApi.pageDataXls(
          handlers.getRequestParams(),
          handlers.getXlsTitle()
        );
      },
    },

    // {
    //   name: "新增",
    //   buttonClass: "primary",
    //   width: 100,
    //   click: ({ row, handlers }) => {
    //     // 点击回调事件方法钩子，  点击触发

    //     VDialog.open({
    //       title: "新增",

    //       content: {
    //         //内容初始形式
    //         type: "component", //text:"",预留文本
    //         name: "/src/drillInfoMaterialRecord/edit",
    //         query: {},
    //       },

    //       callBack: (data: any) => {
    //         handlers.refresh();
    //       },
    //       onClose: () => {
    //         console.log("对话框已关闭");
    //       },
    //     });
    //   },
    // },
    {
      name: "批量删除",
      buttonClass: "danger",
      width: 100,
      isShow: (row: any) => {
        return false;
      },
      click: () => {
        //暴露的方法钩子
        console.log(baseTable.value.getSelection());
      },
    },
  ],
});
// 表格初始化Model
const baseTableModel = ref({
  border: true,
  pagination: true,
  inline: true,
  selectable: true,
  isFullscreen: false,
  minWidth: "200px",
  data: {
    //table  初始化
    current: 1,
    size: 10,
    total: 100,
    data: [],
  },
  requestData: { api: DrillInfoMaterialRecordApi.getPageData, query: {} }, //数据源 参数有效性： 'steady|transient'
  columns: [
    // {
    //   label: "id",
    //   field: "id",
    //   width: 100,
    // },
    // {
    //   label: "1111资料id",
    //   field: "materialId",
    //   width: 120,
    // },
    {
      label: "培训名称",
      field: "drillName",
      width: 150,
    },
    // {
    //   label: "活动id",
    //   field: "drillId",
    //   width: 150,
    // },
    // {
    //   label: "用户id",
    //   field: "userKey",
    //   width: 180,
    // },
    {
      label: "姓名",
      field: "staffName",
      width: 180,
    },
    {
      label: "手机号",
      field: "phone",
      width: 180,
    },
    // {
    //   label: "公司ID",
    //   field: "companyId",
    //   width: 150,
    // },
    // {
    //   label: "员工id",
    //   field: "staffId",
    //   width: 150,
    // },

    {
      label: "身份证号",
      field: "staffIdentity",
      width: 200,
    },
    {
      label: "开始时间",
      field: "startTime",
      width: 200,
    },
    {
      label: "结束时间",
      field: "endTime",
      width: 200,
    },
    {
      label: "上次学习时间",
      field: "latestLearningTime",
      width: 200,
    },
    // {
    //   label: "上次学习detail_id",
    //   field: "latestDetailId",
    //   width: 150,
    // },
    {
      label: "持续时间s",
      field: "duration",
      width: 150,
    },
    // {
    //   label: "资料url",
    //   field: "materialUrl",
    //   width: 180,
    // },
    // {
    //   label: "创建人",
    //   field: "creator",
    //   width: 180,
    // },
    // {
    //   label: "修改人",
    //   field: "reviser",
    //   width: 180,
    // },
    // {
    //   label: "排序",
    //   field: "sort",
    //   width: 120,
    // },
    {
      label: "创建时间",
      field: "create_time",
      width: 200,
    },
    {
      label: "更新时间",
      field: "update_time",
      width: 200,
    },
  ],

  actions: [
    {
      name: "详情",

      buttonClass: "primary",
      buttonType: "text",
      click: ({ row, index, handlers }) => {
        //router.push({name: 'CompanyInfoDetail',})
        VDialog.open({
          title: "详情",
          content: {
            //内容初始形式
            type: "component", //text:"",预留文本
            name: "/drillInfoMaterialRecord/detail",
            query: { drillInfoMaterialRecordId: row.id },
          },
          callBack: (data: any) => {
            handlers.refresh();
          },
          onClose: () => {
            console.log("对话框已关闭");
          },
        });
      },
      isShow: (row: object) => {
        return true;
      },
      fixed: "right",
    },
    // {
    //   name: "编辑",
    //   buttonClass: "primary", //按钮颜色控制
    //   buttonType: "text", // 按钮风格   text  link  button
    //   isShow: (row: object) => {
    //     //根据业务做动态隐藏张氏
    //     return true;
    //   },
    //   click: ({ row, index, handlers }) => {
    //     // 点击回调事件方法钩子，  点击触发

    //     VDialog.open({
    //       title: "编辑",
    //       content: {
    //         //内容初始形式
    //         type: "component", //text:"",预留文本
    //         name: "src/drillInfoMaterialRecord/edit",
    //         query: { drillInfoMaterialRecordId: row.id },
    //       },

    //       callBack: (data: any) => {
    //         handlers.refresh();
    //       },
    //       onClose: () => {
    //         console.log("对话框已关闭");
    //       },
    //     });
    //   },
    //   fixed: "right",
    // },

    // {
    //   name: "删除",
    //   buttonClass: "danger",
    //   buttonType: "text",
    //   fixed: "right",
    //   click: ({ row, index, handlers }) => {
    //     $baseConfirm("您确定要删除当前项吗", null, async () => {
    //       const { message } = await DrillInfoMaterialRecordApi.del({
    //         drillInfoMaterialRecordIds: row.id,
    //       });
    //       $baseMessage(message, "success", "vab-hey-message-success");

    //       handlers.refresh();
    //     });
    //   },
    // },
  ],
});

onActivated(() => { });
</script>
